<template>
    <div class="time">
        <!-- {{$t('m.label.localTime')}}：
        <span v-if="time">{{ time | formatDate}}</span> -->
    </div>
</template>
<script>
import { formatDate } from "assets/js/date";
export default {
    data() {
        return {
            nowTime: "",
            time: "",
            timer: ""
        };
    },
    filters: {
        formatDate(time) {
            let date = new Date(time);
            return formatDate(date, "yyyy-MM-dd hh:mm:ss");
        }
    },
    methods: {
        getTime() {
            this.timer = setInterval(() => {
                this.time = this.time ? this.time + 1000 : "";
            }, 1000);
        },
        getCityTime(countryId) {
            let that = this;
            let city =
                countryId === "7"
                    ? "seattle-wa"
                    : countryId === "8"
                    ? "seattle-wa"
                    : countryId === "2"
                    ? "london"
                    : countryId === "1"
                    ? "berlin"
                    : countryId === "4"
                    ? "paris"
                    : countryId === "3"
                    ? "rome"
                    : countryId === "5"
                    ? "madrid"
                    : "tokyo";
            $.ajax({
                type: "get",
                async: false,
                url:
                    "http://api.k780.com/?app=time.world&city_en=" +
                    city +
                    "&appkey=44576&sign=ecf7e7a1bfb826197725349b8ed15c23&format=json&jsoncallback=data",
                dataType: "jsonp",
                jsonp: "callback",
                jsonpCallback: "data",
                success: function(res) {
                    if (res.success !== "0") {
                        that.time = res.result.timestamp * 1000;
                    } else {
                        that.$message.error(res.msg);
                    }
                }
            });
        }
    },
    beforeDestroy() {
        clearInterval(this.timer);
        this.timer = null;
    },
    mounted() {
        this.getTime();
    }
};
</script> 
<style lang="stylus" scoped>
.time {
    font-size: 14px;
    color: #666;
    padding: 15px 0;

    span {
        font-size: 18px;
        color: #333;
    }
}
</style>